<template>
  <div style="border: 1px solid gray">{{ restTime }}</div>
</template>

<script>
export default {
  name: "xxx",
  data() {
    return {
      restTime: "", // 剩余时间
      //   startDataTime: "2022-11-21 10:29:00", // 开始时间，自己设置或数据库获取
      //   endDataTime: "2022-11-21 11:00:00", // 结束时间，自己设置或数据库获取
      startDataTime: null, // 开始时间，自己设置或数据库获取
      endDataTime:null, // 结束时间，自己设置或数据库获取
      timeStamp: null, // 接收剩余时间戳
      timer: null,
      nowDate:null
    };
  },
  methods: {
    // 时间戳转时分秒
    toHHmmss(data) {
      var s;
      var hours = parseInt((data % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      var minutes = parseInt((data % (1000 * 60 * 60)) / (1000 * 60));
      var seconds = (data % (1000 * 60)) / 1000;
      s =
        (hours < 10 ? "0" + hours : hours) +
        ":" +
        (minutes < 10 ? "0" + minutes : minutes) +
        ":" +
        (seconds < 10 ? "0" + seconds : seconds);
      if (s.length > 8) {
        s = s.slice(0, 8);
      }
      return s;
    },
    // 时分秒转时间戳
    toTimeStamp(date) {
      var s = "";
      var hour = date.split(":")[0];
      var min = date.split(":")[1];
      var sec = date.split(":")[2];
      s = Number(hour * 3600) + Number(min * 60) + Number(sec);
      s = s * 1000;
      return s;
    },
    // 初始化获取时间
    getRestTime() {
      // 赋值转时分秒
      this.restTime = this.toHHmmss(this.timeStamp);
      // 所以不是大于0秒
      if (this.timeStamp >= 1000) {
        // 1000为一秒
        // 如果大于1秒
        this.timeStamp = this.timeStamp - 1000;
      } else {
        // 倒计时最后一秒将剩余时间修改
        this.restTime = "00:00:00";
        // 清除定时器
        clearInterval(this.timer);
        // 在这里编写考试交卷或自动取消订单的功能
        console.log("结束定时器!");
      }
    },
    // 获取几分钟之后的时间
    getAfterDate(n,curTime) {
            // var curTime = new Date();
            // var d = new Date(curTime.setMinutes(curTime.getMinutes() + n * 60)); //n是分钟，根据自己需求定义
            var d = new Date(curTime.setMinutes(curTime.getMinutes() + n)); //n是分钟，根据自己需求定义
            var year = d.getFullYear();
            var mon = d.getMonth() + 1;
            var day = d.getDate();
            var hour = d.getHours();
            var minute = d.getMinutes();
            var second = d.getSeconds();
            var s = year + "-" + (mon < 10 ? ('0' + mon) : mon) + "-" + (day < 10 ? ('0' + day) : day) + ' ' + (hour < 10 ? ('0' + hour) : hour) + ':' + (minute < 10 ? ('0' + minute) : minute) + ':' + (second < 10 ? ('0' + second) : second);
            return s;
        },
  },
  // 获取时间差长度只需要做一次
  created() {
    // 处理字符串为时间类型
    // let startTime = Date.parse(this.startDataTime.replace(/-/g, "-"));
    // let endTime = Date.parse(this.endDataTime.replace(/-/g, "-"));
    // // 调用moment插件计算时间差(做完这一步timeStamp为时间戳了)
    // this.timeStamp = this.$moment(endTime).diff(this.$moment(startTime));.toLocaleString();
    this.nowDate = new Date()
    console.log(this.nowDate,'this.nowDate');

    this.startDataTime = this.getAfterDate(0,this.nowDate)
    // this.startDataTime = this.nowDate
    this.endDataTime = this.getAfterDate(1,this.nowDate)
    console.log(this.startDataTime,this.endDataTime,'1');

    let startTime = Date.parse(this.startDataTime.replace(/-/g, "-"));
    let endTime = Date.parse(this.endDataTime.replace(/-/g, "-"));
    // 调用moment插件计算时间差(做完这一步timeStamp为时间戳了)
    this.timeStamp = this.$moment(endTime).diff(this.$moment(startTime));
  },
  // 计算
  mounted() {
    // 倒计时,每一秒执行一次
    if (this.timer) clearInterval(this.timer);
    this.timer = setInterval(this.getRestTime, 1000);
  },
  // 退出页面清除定时器
  beforeDestroy() {
    clearInterval(this.timer);
  },
};
</script>

<style></style>
